<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link rel="stylesheet" type="text/css" href="sass/index.css"/>
		<link rel="stylesheet" type="text/css" href="css/swiper.min.css"/>
		<script src="js/swiper-3.4.2.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/jquery-3.1.1.min.js" type="text/javascript" charset="utf-8"></script>
		<style>
			.t_h,.t_m,.t_s{
				width: 3rem;
			}
		</style>
	</head>
	<body>
		<div class="nav">
			<div class="d1">
				<img src="img/classifyImage.png"/>
			</div>
			<div class="d2">
				<div class="d1"><input type="text" placeholder="天猫超市  一站式"/></div>
				<div class="d2"><a href=""><img src="img/shoppingcartImega.png"/></a>&nbsp;&nbsp;|&nbsp;&nbsp; <span>北京</span></div>
			</div>
		</div>
		<div class="swiper-container">
			<div class="swiper-wrapper">
				<div class="swiper-slide"><img src="img/a1.png"/></div>
				<div class="swiper-slide"><img src="img/a2.png"/></div>
				<div class="swiper-slide"><img src="img/a3.png"/></div>
				<div class="swiper-slide"><img src="img/a4.png"/></div>
				<div class="swiper-slide"><img src="img/a5.png"/></div>
				<div class="swiper-slide"><img src="img/a6.png"/></div>
			</div>
			<div class="swiper-pagination"></div>
		</div>
		<div class="banan jb-list">
			<ul>
				<li index="0"><img src="img/1.png"/><span>母婴玩具</span></li>
				<li index="1"><img src="img/2.png"/><span>休闲零食</span></li>
				<li index="2"><img src="img/3.png"/><span>酒水乳品</span></li>
				<li index="3"><img src="img/4.png"/><span>粮油副食</span></li>
				<li index="4"><img src="img/5.png"/><span>洗护美妆</span></li>
			</ul>
			<ul>
				<li index="5"><img src="img/6.png"/><span>家居用品</span></li>
				<li index="6"><img src="img/7.png"/><span>纸品家清</span></li>
				<li index="7"><img src="img/8.png"/><span>家用电器</span></li>
				<li index="8"><img src="img/9.png"/><span>进口食品</span></li>
				<li index="9"><img src="img/10.png"/><span>出游季</span></li>
			</ul>
		</div>
		<div class="mini">
			<div class="left">
				<div class="s-top">
					<img src="img/cont_03.png"/>
					<br />
					<p>12点场剩余时间</p>
						<span><button style="margin-left: 0;" class="t_h">0</button><span>:</span>
						<button style="margin-left: 0;" class="t_m">0</button><span>:</span>
						<button style="margin-left: 0;" class="t_s">0</button></span>
					
				</div>
				<div class="s-button">
					<img src="img/zhijin.png"/>
					<div class="dong1" style="animation: dong 3s ease infinite;">
						一元起
					</div>
				</div>
			</div>
			<div class="right">
				<div class="r-top">
					<div class="zz">
						<p class="p">生鲜区</p>
						<p>买二免一</p>
						<p>爆款直降</p>
					</div>
					<div class="xx">
						<img src="img/shengxian.png"/>
						<div class="dong2" style="animation: dong 3s ease infinite;">
							<p>￥37.6</p>
							<p>一份</p>
						</div>
					</div>
				</div>
				<div class="r-button">
					<div>
						<p>好货</p>
						<p>超市热卖</p>
						<img src="img/cont_12.png" alt="" />
					</div>
					<div>
						<p>贩卖装</p>
						<p>仅2.2元/盒</p>
						<img src="img/cont_14.png" alt="" />
					</div>
					<div>
						<p>9元馆</p>
						<p>抢优品</p>
						<img src="img/cont_16.png" alt="" />
					</div>
				</div>
			</div>
		</div>
		<div class="gui">
			<div class="d1"><img src="img/cont_22.png" alt="" /><p>买贵一赔十倍</p></div>
			<div class="d2"><img src="img/cont_23.png" alt="" /></div>
			<div class="d3"><img src="img/cont_25.png" alt="" /></div>
			<div class="d4"><img src="img/cont_26.png" alt="" /></div>
		</div>
		<div class="foot">
			<div>
				<a href="javascript:;">
				<img src="img/JJ_03.png" alt="" />
				<p>首页</p></a>
			</div>
			<div>
				<a href="javascript:;">
				<img src="img/JJ_05.png" alt="" />
				<p>物流</p></a>
			</div>
			<div>
				<a href="html/gouwuche.html">
				<img src="img/JJ_07.png" alt="" />
				<p>购物车</p></a>
			</div>
			<div>
				<a href="html/me.html">
				<img src="img/JJ_09.png" alt="" />
				<p>我的淘宝</p></a>
			</div>
			<div>
				<a href="javascript:;">
				<img src="img/JJ_11.png" alt="" />
				<p>更多</p>
				</a>
			</div>
			
		</div>
	</body>
</html>
<script type="text/javascript">
	window.onload = function() {
		document.documentElement.style.fontSize = document.documentElement.clientWidth / 320 * 20 + 'px';
		window.onresize = function() {
			document.documentElement.style.fontSize = document.documentElement.clientWidth / 320 * 20 + 'px';
		};
		var swiper = new Swiper(".swiper-container",{
			autoplay: 1000,
			loop: true,
			speed: 2000,
			pagination: '.swiper-pagination',
			paginationClickable: true,
			autoplayDisableOnInteraction: false
		})
		var t=3600000;
	    function GetRTime() {
	
		        t-=1000;
		    var h = 0;
		    var m = 0;
		    var s = 0;
		    if (t >= 0) {
		        h = Math.floor(t / 1000 / 60 / 60 % 24);
		        m = Math.floor(t / 1000 / 60 % 60);
		        s = Math.floor(t / 1000 % 60);
		    }
			$('.t_h').text(h)
			$('.t_m').text(m)
			$('.t_s').text(s)
	    	
	    }
	    setInterval(GetRTime, 1000);
	};

    $('.banan ul li').click(function(){
        var num=$(this).attr('index');
        sessionStorage.setItem('num',num);
        location.href="html/option.html"
    })
</script>